import './assets/main.css'

import { createApp } from 'vue'
import { createPinia } from 'pinia'
import ElementPlus from 'element-plus'
import locale from 'element-plus/es/locale/lang/zh-cn.mjs'
import App from './App.vue'
import router from './router'
import { registerMicroApps, start, initGlobalState } from "qiankun";
const app = createApp(App)

app.use(createPinia())
app.use(router)
app.use(ElementPlus, { locale })
app.mount('#app')
// 初始化 state
let initState = { count: 0 };
const actions = initGlobalState(initState);
// 在主应用中监听贡献数据的变化
actions.onGlobalStateChange((state) => {
  initState = state;
}, true);

const getGlobalState = () => initState;
// 注册子应用
registerMicroApps([
    {
      // 子应用的名称，必须唯一。
      name: "react-app",
      // 子应用项目本地运行地址
      entry: "//localhost:8100",
      // 子应用的容器（子应用嵌入到主项目id为container的地方）
      container: "#container",
      activeRule: "/react",
      //子应用激活时的路由规则（子应用路由）
      props: { getGlobalState },
    },
    {
      name: "vue-app",
      entry: "//localhost:8200",
      container: "#container",
      activeRule: "/vue",
      props: { getGlobalState },
    },
  ]);
  
  start({ sandbox: { strictStyleIsolation: false, experimentalStyleIsolation: true } });